{extend name="sitehome@style/base"/}
{block name="resources"}
<link rel="stylesheet" href="SNS_CSS/file.css">
<style>
    .layui-fluid{background-color: transparent;padding: 0;}
    .category_name{margin-top: 10px;}
    .layui-form-item .layui-form-checkbox {
        margin-top: 1px;
    }
</style>
{/block}
{block name="main"}
<div class="nc-step">
	<span class="layui-breadcrumb" lay-separator="|" style="visibility: visible;">
<!--		  <a class="nc-step-tab ">1 选择栏目</a><span lay-separator="">|</span>-->
		  <a class="nc-step-tab nc-step-active"> 编辑信息</a>
	</span>
</div>
<div class="nc-step-content">
    <!--<div class="nc-step-item layui-form ">
        <div class="layui-collapse" lay-filter="category">
            {foreach $category_list as $key=>$vo }
            <div class="layui-colla-item">
                <h2 class="layui-colla-title">
                    {$vo.name}
                </h2>
                <div class="layui-colla-content layui-show category_{$vo.category_id}">
                    {foreach $vo.child_list as $key=>$val }
                    <div class="layui-btn layui-btn-primary">
                        <span lay-util="next_step" category = '{$val.category_id}' {if($val.category_id == $category_info.category_id)}style="color:#12b7f5!important;"{/if}>{$val.name}</span>
                    </div>
                    {/foreach}
                </div>
            </div>
            {/foreach}
        </div>
    </div>-->
    <div class="nc-step-item info-attribute layui-show">
        <div class="layui-form">
            <div class="nc-quote-box">
                <div class="layui-form-item ">
                    <label class="layui-form-label">当前分类</label>
                    <div class="layui-input-inline category_name">
                        <span id="category_name">{$parent_category_info.name}/{$category_info.name}</span>
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">
                        <span class="required">*</span>圈子</label>
                    <div class="layui-input-inline">
                        <select name="province" lay-filter="province" lay-verify="province">
                            <option value="">选择省份</option>
                            {foreach $province as $key=>$vo }
                                <option value="{$vo.id}" {if  $vo.id == $circle.pid }selected{/if}>{$vo.name}</option>
                            {/foreach}
                        </select>
                    </div>
                    <div class="layui-input-inline">
                        <select name="city" lay-filter="city" lay-verify="city" class="city">
                            <option value="">选择城市</option>
                            {foreach $city as $key=>$vo }
                                <option value="{$vo.id}" {if  $vo.id == $circle.id }selected{/if}>{$vo.name}</option>
                            {/foreach}
                        </select>
                    </div>
                </div>

                <div class="layui-form-item layui-price">
                    <label class="layui-form-label"><span class="required">*</span>价格</label>
                    <div class="layui-input-inline">
                        <input type="text" name="price" value="{$info_detail.price}" autocomplete="off" placeholder="" class="layui-input price" lay-verify="price">
                    </div>
                    <div class="layui-form-mid">{:empty($category_info.price_unit) ? '' : '/'.$category_info.price_unit}</div>
                    <div class="layui-input-inline checkbox_my {if $info_detail.price == '面议' } layui-form-checked {/if}">
                        <input type="checkbox" name="checkbox_price" value="面议" title="面议" >
                        <input type="hidden" class="checkbox_price" {if $info_detail.price == '面议' } value="2" {/else} value="1" {/if}>
                    </div>
                </div>

                <div class="layui-form-item">
                    <label class="layui-form-label"><span class="required">*</span>联系人</label>
                    <div class="layui-input-inline">
                        <input type="text" name="linkman" value="{$info_detail.linkman}" autocomplete="off" placeholder="请输入联系人" class="layui-input nc-len-long" lay-verify="linkman">
                    </div>
                </div>

                <div class="layui-form-item">
                    <label class="layui-form-label"><span class="required">*</span>联系电话</label>
                    <div class="layui-input-inline">
                        <input type="text" name="contact" value="{$info_detail.contact}" autocomplete="off" placeholder="请输入联系电话" class="layui-input nc-len-long" lay-verify="contact">
                    </div>
                </div>

                <div class="layui-form-item">
                    <label class="layui-form-label"><span class="required">*</span>{$category_info['title_label'] ?: '标题'}</label>
                    <div class="layui-input-inline">
                        <input type="text" name="title" value="{$info_detail.title}" autocomplete="off" placeholder="{$category_info['title_placeholder'] ?: '请输入标题'}" class="layui-input nc-len-long" lay-verify="title">
                    </div>
                </div>

                <div class="layui-form-item">
                    <label class="layui-form-label">{$category_info['content_label'] ?: '内容'}</label>
                    <div class="layui-input-inline">
                        <textarea id="content" name="content"  class="layui-textarea">{$info_detail.content}</textarea>
                    </div>
                </div>

                {volist name = "list['data']" id = "vo" key = "k"}
                <div class="layui-form-item">
                    <label class="layui-form-label">{if condition="$vo.required eq 1"}<span class="required">*</span>{/if}{$vo.name}</label>

                    <div class="layui-input-inline">

                        {switch name="$vo['input_type']" }

                        {case value="text"}

                        <input type="text" name="attribute_field_{$vo.attribute_id}"
                               {if condition="$vo.required eq 1"} lay-verify="title" {/if}
                        {if condition="$vo.args.text_length neq ''"} maxlength="{$info_attribute_value.content}" {/if}
                        {if condition="$vo.args.text_default_value neq ''"} value="{$info_attribute_value.content}" {/if}
                        autocomplete="off" placeholder="" class="layui-input nc-len-long">

                        {/case}

                        {case value="textarea"}
                        <textarea name="desc_{$vo.attribute_id}" placeholder="请输入内容" class="layui-textarea"
                                  style = "width:{$vo.args.textarea_width =='' ? '200px' : $vo.args.textarea_default_value};
                              height:{$vo.args.textarea_height =='' ? '200px' : $vo.args.textarea_default_value};"
                        ">{$info_attribute_value.content}</textarea>
                        {/case}

                        {case value="editor"}
                        <textarea id="editor" >{$info_attribute_value.content}</textarea>
                        <input type="hidden" class="attribute_id" value="{$vo.attribute_id}">
                        {/case}

                        {case value="select"}
                        <select name="select_{$vo.attribute_id}" lay-verify="required">
                            {volist name = "$vo.args.select_option" id = "option"}
                            <option value="{$option}"  {if condition ="$option eq $info_attribute_value.content"}selected{/if}>{$option}</option>
                            {/volist}
                        </select>
                        {/case}

                        {case value="radio"}
                        {volist name = "$vo.args.radio_option" id = "radio"}
                        <input type="radio" name="radio_{$vo.attribute_id}" value="{$radio}" title="{$radio}" {if condition ="$radio eq $info_attribute_value.content"}checked{/if}>
                        {/volist}
                        {/case}

                        {case value="checkbox"}
                        {volist name = "$vo.args.checkbox_option" id = "checkbox"}
                        <input type="checkbox" name="checkbox_{$vo.attribute_id}" value="{$checkbox}" title="{$checkbox}" {if condition ="$checkbox eq $info_attribute_value.content"}checked{/if}>
                        {/volist}
                        {/case}

                        {case value="img"}
                        <div class="img-upload">
                            <input type="hidden" class="layui-input" name = "title_img_{$vo.attribute_id}" value="" />
                            <div class="upload-img-inline title_img">
                                <div class="upload-img-box" onclick="uploadSingletitle_img()" >
                                    <div>
                                        <i class="add">+</i>
                                    </div>
                                </div>
                            </div>
                            {:hook("fileUpload", ["name" => "title_img", "file_type" => "IMAGE", "type" => "common"], '', true)}
                        </div>
                        <div style="clear: both"></div>
                        {/case}

                        {case value="imgs"}
                        <div class="img-upload">
                            <input type="hidden" class="layui-input" name = "title_img_{$vo.attribute_id}" value="" />
                            <div class="upload-img-inline title_img">
                                <div class="upload-img-box" onclick="uploadSingletitle_img()" >
                                    <div>
                                        <i class="add">+</i>
                                    </div>
                                </div>
                            </div>
                            {:hook("fileUpload", ["name" => "title_img", "file_type" => "IMAGE", "type" => "common"], '', true)}
                        </div>
                        <div style="clear: both"></div>
                        {/case}

                        {case value="file"}
                        {:hook("fileUpload", ['name' => 'article', 'type' => 'common', 'file_type' => 'ATTACHMENT'], '', true)}
                        <div>
                            <button type="button" class="layui-btn layui-btn-sm" onclick="uploadEnclosurearticle()">上传附件</button>
                        </div>
                        <input type="hidden" name="attachment_path" autocomplete="off" placeholder="" class="layui-input nc-len-long" style="margin-top:10px;">
                        {/case}

                        {case value="files"}
                        {:hook("fileUpload", ['name' => 'article', 'type' => 'common', 'file_type' => 'ATTACHMENT'], '', true)}
                        <div>
                            <button type="button" class="layui-btn layui-btn-sm" onclick="uploadEnclosurearticle()">上传附件</button>
                        </div>
                        <input type="hidden" name="attachment_path" autocomplete="off" placeholder="" class="layui-input nc-len-long" style="margin-top:10px;">
                        {/case}

                        {case value="number"}

                        <input type="number" name="attribute_field_{$vo.attribute_id}" value="{$info_attribute_value.content}"
                               {if condition="$vo.args.number_default_value neq ''"} min="{$vo.args.number_default_value}" {/if}
                        {if condition="$vo.args.number_default_value neq ''"} max="{$vo.args.number_default_value}" {/if}
                        {if condition="$vo.args.number_default_value neq ''"} value="{$vo.args.number_default_value}" {/if}
                        autocomplete="off" placeholder="" class="layui-input nc-len-long">
                        {/case}

                        {case value="time"}
                        时间
                        {/case}

                        {case value="map"}
                        地图坐标
                        {/case}

                        {case value="area"}
                        地区选择框
                        {/case}
                        {/switch}
                    </div>
                </div>
                {/volist}

                <!-- 上传图片 -->
                <div class="layui-form-item">
                    <label class="layui-form-label img-upload-lable">{$category_info['icon_label'] ?: '封面图'}</label>
                    <div  class="layui-input-inline article img-upload" id="layer-photos">
                        <div>
                            <input type="hidden" class="layui-input" name = "title_img" value="{$info_detail['icon']}" />
                            <div class="upload-wrap">
                                <div>
                                    <button class="layui-btn layui-btn-sm"  onclick="upload()">上传图片</button>
                                </div>
                                {:hook("fileUpload", ["name" => "", 'type' => 'multiple', 'file_type' => 'IMAGE','size' => '2000', 'thumb_type' => 'big,mid,small'], '', true)}
                            </div>
                        </div>
                        <div style="clear: both"></div>
                    </div>
                </div>

                <div class="layui-row"></div>

                <div class="nc-form-row active">
                    <input type="hidden" name="info_id" class="info_id" value="{$info_detail.info_id}"/>
                    <input type="hidden" name="category_id" class="category-id" value="{$category_info['category_id']}">
                    <!--<button class="layui-btn last_step" lay-util="last_step">上一步</button>-->
                    <button class="layui-btn" lay-submit lay-filter="btnInfo" type="button">保存</button>
                    <button onclick="window.history.back(-1)" class="layui-btn layui-btn-primary">返回</button>
                </div>
            </div>
        </div>
    </div>
</div>

<!-- 相册  big_pic_path -->
<script type="text/html" id="album_html" >           
    {{#  layui.each(d, function(index, item){ }}
    <div class="layui-col-md2 img_{{ index }}">
        <div class="image-box">
            <img layer-pid="{{ index }}" layer-src="{{ nc.img(item.path) }}" src="{{ nc.img(item.path) }}" />
        </div>
        <div class="image-title">
            <div class="layui-form" >
                <span class="layui-form-item">
                        <input type="hidden" name="check_s[]" value="{{ item.path }}">
                    <!-- <input type="checkbox" name="check[]" lay-skin="primary" title="{{ item.file_name  }}" value="{{ item.id }}" lay-filter="oneChoose"> -->
                </span>
            </div>
        </div>
        <div class="image-link">
            <div >
                <button type="button" class="layui-btn layui-btn-primary layui-btn-xs delfile">删除</button>
                <input type="hidden" value="{{ index }}" class="file_id"/>
            </div>
        </div>
    </div>
    {{#  }); }}
</script>

{/block}
{block name="script"}
<script type="text/javascript" src="http://webapi.amap.com/maps?v=1.4.6&amp;key=2df5711d4e2fd9ecd1622b5a53fc6b1d"></script>
<script type="text/javascript" src="STATIC_JS/map_address.js?n=1"></script>
<script type="text/javascript">
    var editor = new Editor("content",{});
    var editor_id = new Editor("editor",{});
    var tpl_data = new Object();//地址id数据
    tpl_data.circle_id = '{$circle.id}';
    tpl_data.province_id = '{$circle.pid}';
    var page_index = '{$page_index}';
    var attribute_id = $('.attribute_id').val();
    var category_id = $('.category-id').val();

    var form;
    var laypage;
    var laytpl;
    var limit = 20;

    //价格面议
    $('body').on('click','.checkbox_my',function () {
        var checkbox_price = $(this).children(".checkbox_price").val();

        if(checkbox_price == 1){
            $('.price').val('面议');
            $('.checkbox_price').val(2);
            $("body .checkbox_my div").addClass("layui-form-checked");
        }else{

            $('.price').val('');
            $('.checkbox_price').val(1);
            $("body .layui-price div:eq(2)").removeClass("layui-form-checked");
            $("body .checkbox_my div").removeClass("layui-form-checked");
        }
    });

    //删除图片
	$('body').on("click", ".delfile", function () {
        var index = $(this).parent().children('.file_id').val();
        $('.img_'+index).remove();
	});

    layui.use(['form','util', 'laypage', 'laytpl'], function () {
        laytpl = layui.laytpl;
        form = layui.form;
        util = layui.util;
		var repeat_flag = false;//防重复标识

        getImgs(1, limit);

        //按钮事件
        util.event('lay-util', {
            next_step: function (e) {

                category_id = $(e).attr('category');
                category_name = $(e).parents('.layui-colla-item').children('.layui-colla-title').prop('firstChild').nodeValue+ '/ '+$(e).text();
                console.log(category_id);
                stepChange(1);
            }
            , last_step: function () {
                stepChange(0);
            }
        })

        /**
         * 切换步骤
         */
        function stepChange(sort){
            $(".nc-step .nc-step-tab").removeClass("nc-step-active");
            $(".nc-step .nc-step-tab:eq("+ sort +")").addClass("nc-step-active");
            $(".nc-step-content .nc-step-item").removeClass("layui-show");
            $(".nc-step-content .nc-step-item:eq("+ sort +")").addClass("layui-show");
        }

        //监听省地址的变动
        form.on('select(province)', function (obj) {
            var province_id = obj.value;

            $.ajax({
                type: "post",
                url: nc.url("sns://sitehome/info/getProvinces"),
                data: {
                    province_id: province_id
                },
                async: false,
                dataType: "JSON",
                success: function (data) {

                    var arrData = JSON.parse(data);

                    $("select[name=city] option:gt(0)").remove();

                    var  html = '';

                    for(var i = 0; i < arrData.length; i++){
                        html += "<option value='"+arrData[i]['id']+"'>"+arrData[i]['name']+"</option>";
                    }

                    $(".city").append(html);

                    form.render();
                }
            });
        });

        //提交数据
        form.on('submit(btnInfo)', function (data) {

            if(!data.field.city){
                layer.msg( "请选择圈子");
                return false;
            }

            if (!data.field.linkman) {
                layer.msg( "联系人不能为空");
                return false;
            }

            if (!data.field.contact) {
                layer.msg( "联系电话不能为空");
                return false;
            }

            if (!data.field.price) {
                layer.msg( "价钱不能为空");
                return false;
            }

            if (!data.field.title) {
                layer.msg( "标题名称不能为空");
                return false;
            }

            data.field.content = editor.getContent();
            data.field.category_id = category_id;
	
            if (repeat_flag) return;
			repeat_flag = true;
            $.ajax({
                type: "post",
                url: nc.url('sns://sitehome/info/editInfo'),
                data: data.field,
                dataType: "JSON",
                success: function (data) {
                    if (data.code == 0) {
                        window.location.href = nc.url("sns://sitehome/info/infolist",{page:page_index});
                    } else {
						repeat_flag = false;
                        layer.msg(data.message);
                    }
                }
            });

        });
    });

    //设置图片
    function singleMultipleImageUploadSuccess(data, name){
        var info_id = $(".info_id").val();
        $.ajax({
            type: "post",
            url: nc.url("sns://sitehome/info/setInfoImgs"),
            data: {
                data: data,
                info_id: info_id
            },
            async: false,
            dataType: "JSON",
            success: function (data) {
                getImgs(1,limit);
            }
        });
    }

    //获取图片
    function getImgs(page, limit){
        var info_id = $(".info_id").val();
        $.ajax({
            type: "get",
            url: nc.url("sns://sitehome/info/getInfoDetails"),
            data: {
                page: page,
                limit: limit,
                type: 'IMAGE',
                info_id: info_id,
                order: $("#img_order").val(),
                file_name: $("input[name='search_file_name']").val()
            },
            async: false,
            dataType: "JSON",
            success: function (data) {
                //渲染相册
                var album_tpl = $("#album_html").html();
                laytpl(album_tpl).render(data.data, function (html) {
                    $(".layui-row").html(html);
                    loadImgMagnify();
                });
                
                $('.image-data').hide();
                if (data.data.count > 0) {
                    //调用分页
                    laypage.render({
                        elem: 'paged',
                        count: data.data.count,
                        curr: page, //当前页
                        layout: nc.get_page_param(),
                        prev: '<i class="layui-icon layui-icon-left"></i>',
                        next: '<i class="layui-icon layui-icon-right"></i>',
                        limit: limit,
                        jump: function (obj, first) {
                            if (!first) { //一定要加此判断，否则初始时会无限刷新
                                getFileAlbumList(obj.curr, obj.limit);//一定要把翻页的ajax请求放到这里，不然会请求两次。
                            }
                            form.render('checkbox');
                        }
                    });
                    $('.image-data').show();
                }
            }
        });
    }

    function getFileAlbumList(page, limit) {
    }
</script>
<!--<script src="SNS_JS/add_info.js"></script>-->
{/block}